/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 27/03/2019, 08:43:21 PM
    Author     : Cesar Maya
*/
.cuerpo{
    width: 100%;
    min-height: 600px;
    margin-top: 80px;
    margin-bottom: 30px;
    font-family: 'Open Sans', sans-serif;
    font-size: 14pt;
    background-color: #E6E6E6;
    }
.titutlopagina{
        width: 100%;
        height: 150px;
        color: #FFF;
        background-image: url('../imagenes/fondoClub1.jpg');
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: relative;
        padding-top: 2%;
    }
    @media (max-width:767px){
        #evento3{
            display: none;            
        }
        #evento2{
            display: none;
        }
        #evento1{
            display: block;
        }
        
        .titutlopagina h3{
            float: right;
            font-size: 1.15em;
            font-weight: bold;
            text-shadow:
                -1px -1px 0 #000,
                1px -1px 0 #000,
                -1px 1px 0 #000,
                1px 1px 0 #000;       
        }
        .lineaTitulo{
            width: 100%;
            float: right;
            height: 2px;
            background-color: #FFF;
            -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
            -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
            animation-name: example;
            animation-duration: 2s;
        }
        .espacio1{
            display: none;
        }
        /* Safari 4.0 - 8.0 */
        @-webkit-keyframes example {
          0%   {width: 100%;margin-left: 0%;}
          50%  {width: 5%;margin-left: 95%;}
          100% {width: 100%;margin-left: 0%;}
          }

        /* Standard syntax */
        @keyframes example {
          0%   {width: 100%;margin-left: 0%;}
          50%  {width: 5%;margin-left: 95%;}
          100% {width: 100%;margin-left: 0%;}
          }
          .contenidoPrincipalEventos{
              width: 100%;
              margin: auto;
              margin-top: 10px;
          }
          .menuPaginaEventos{
              width: 100%;
              display: flex;
              flex-direction: column;
          }
          .botonSubmenu{
              background-color: #6EA205;
              color: #FFF;
              width: 60%;
              margin-left: 20%;
              margin-right: 20%;
              margin-top: 10px;
          }
          .espacioEventos{
              width: 100%;
              margin: auto;
              margin-top: 30px;
              margin-bottom: 20px;
              padding: 0;
          }
          .evento1-1{
              width: 100%;
              display: none;
          }
          .evento1-2{
              width: 100%;
              margin: auto;
              
          }
          
          .contedorSlider{
              width: 100%;
              background-color: #6EA205;
              padding: 15px;
              display: flex;
              flex-direction: row;
              flex-wrap: wrap;
              justify-content: space-around;
              height: 400px;
              
          }
          .contedorSlider2{
              width: 100%;
              background-color: #6EA205;
              padding: 15px;
              display: flex;
              flex-direction: row;
              flex-wrap: wrap;
              justify-content: space-around;
              
          }
          .contenidoSlider{
              width: 32%;
              border-radius: 5px;
              border-style: solid;
              border-width: 2px;
              border-color: #abdde5;
              background-color: #FFF;
              
          }.contenidoSlider2{
              width:100%;
              border-radius: 5px;
              border-style: solid;
              border-width: 2px;
              border-color: #abdde5;
              background-color: #FFF;
              
          }
          .contenidoSlider h4{
              width: 80%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #6EA205;
              font-size: 1em;
              text-align: center;
              font-weight: bold;
          }
          .contenidoSlider2 h4{
              width: 80%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #6EA205;
              font-size: 1.2em;
              text-align: center;
              font-weight: bold;
          }
          .contenidoSlider h5{
              width: 96%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #000;
              font-size: 0.7em;
              text-align: start;
              font-weight: bold;
          }
          .contenidoSlider2 h5{
              width: 96%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #000;
              font-size: 0.7em;
              text-align: start;
              font-weight: bold;
          }
          .contenidoSlider img{
              width: 96%;
              margin-left: 2%;
              margin-right: 2%;
              margin-bottom: 5px;
              margin-top: 5px;
              text-align: center;              
          }
          .contenidoSlider2 img{
              width: 80%;
              margin-left: 10%;
              margin-right: 10%;
              margin-bottom: 5px;
              margin-top: 5px;
              text-align: center;              
          }
          .contenidoSlider p{
              width: 94%;
              margin-left: 3%;
              margin-right: 3%;
              margin-bottom: 5px;
              margin-top: 5px;
              font-size: 0.7em
              
          }
          .contenidoSlider2 p{
              width: 94%;
              margin-left: 3%;
              margin-right: 3%;
              margin-bottom: 5px;
              margin-top: 5px;
              font-size: 0.8em
              
          }
          /* informacion eventos */
          .cajonInformacionEventos{
              width: 90%;
              margin: auto;
              display: flex;
              flex-direction: column;
              justify-content: space-around;
              margin-top: 30px;
              margin-bottom: 20px;
          }
          .sliderEventosInfo{
              width: 80%;
              margin: auto;
          }
          .cajonSlide{
              width: 100%;
          }
          .carousel-control-prev{
              height: 50px;
              margin-top: 35%;
          }
          .carousel-control-next{
              height: 50px;
              margin-top: 35%;
          }
          .carousel-control-prev-icon{
              background-color: #555;
              width: 40px;
              height: 40px;
          }
          .carousel-control-prev-icon:hover{
              background-color: #6EA205;
              width: 40px;
              height: 40px;
          }
          .carousel-control-next-icon{
              background-color: #555;
              width: 40px;
              height: 40px;
          }
          .carousel-control-next-icon:hover{
              background-color: #6EA205;
              width: 40px;
              height: 40px;
          }
          .informacionEventos{
              width: 80%;
              margin: auto;
              display: flex;
              flex-direction: column;
              
              padding-left:  3%;
          }
          .informacionEventos h3{
              color: #6EA205;
              font-weight: bold;
          }
          .informacionEventos p{
              color: #000;
          }
          .informacionEventos ul{
                          
          }
          
          /* eventos */
          .espacioEventos{
              width: 100%;
          }
          .cajaEvento{
              width: 100%;
              display: flex;
              flex-direction: column;
          }
          .tituloSliderEvento{
              width: 100%;
              text-align: center;
          }
          .tituloSliderEvento h3{
              font-size: 1.5em;
              font-weight: bold;
              color: #6EA205;
          }
          .sliderEvento{
              width: 100%;
              
          }
          .contenedorNoticiasSlider{
              width: 100%;              
              display: flex;
              flex-direction: row;
              justify-content: space-around;
          }
          .noticia{
              width: 90%;
              text-align: center;
          }
          .botonNoticia{
              width: 100%;
              text-decoration: none;
          }
          .tituloNoticia{
              width: 100%;
              text-align: center;
          }
          .tituloNoticia h4{
              font-size: 1em;
              font-weight: bold;
              color: #6EA205;
          }
          .imagenNoticia{
              width: 100%;
              
          }
          .imagenNoticia img{
              width: 90%;
              margin: auto;
              height: auto;
          }
          /* Fin eventos */
          /* Fin Informacion eventos */
    }
    @media only screen and (min-width:768px) and (max-width:1068px){
        #evento3{
            display: none;            
        }
        #evento2{
            display: block;
        }
        #evento1{
            display: none;
        }
        
        
        .titutlopagina h3{
            float: right;
            font-size: 1.7em;
            font-weight: bold;
            text-shadow:
                -1px -1px 0 #000,
                1px -1px 0 #000,
                -1px 1px 0 #000,
                1px 1px 0 #000;       
        }
        .lineaTitulo{
            width: 100%;
            float: right;
            height: 2px;
            background-color: #FFF;
            -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
            -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
            animation-name: example;
            animation-duration: 2s;
        }
        /* Safari 4.0 - 8.0 */
        @-webkit-keyframes example {
          0%   {width: 100%;margin-left: 0%;}
          50%  {width: 5%;margin-left: 95%;}
          100% {width: 100%;margin-left: 0%;}
          }

        /* Standard syntax */
        @keyframes example {
          0%   {width: 100%;margin-left: 0%;}
          50%  {width: 5%;margin-left: 95%;}
          100% {width: 100%;margin-left: 0%;}
          }
          .contenidoPrincipalEventos{
              width: 80%;
              margin: auto;
              margin-top: 10px;
          }
          .menuPaginaEventos{
              width: 100%;
              display: flex;
              justify-content: space-around;
          }
          .botonSubmenu{
              background-color: #6EA205;
              color: #FFF;
          }
          .espacioEventos{
              width: 90%;
              margin: auto;
              margin-top: 30px;
              margin-bottom: 20px;
              padding: 0;
          }
          .evento1-1{
              width: 100%;
              display: none;
          }
          .evento1-2{
              width: 90%;
              margin: auto;
              
          }
          .contedorSlider{
              width: 100%;
              background-color: #6EA205;
              padding: 15px;
              display: flex;
              flex-direction: row;
              flex-wrap: wrap;
              justify-content: space-around;
              height: 400px;
              
          }
          .contedorSlider2{
              width: 100%;
              background-color: #6EA205;
              padding: 15px;
              display: flex;
              flex-direction: row;
              flex-wrap: wrap;
              justify-content: space-around;
              height: 500px;
              
          }
          .contenidoSlider{
              width: 32%;
              border-radius: 5px;
              border-style: solid;
              border-width: 2px;
              border-color: #abdde5;
              background-color: #FFF;
              
          }.contenidoSlider2{
              width: 70%;
              border-radius: 5px;
              border-style: solid;
              border-width: 2px;
              border-color: #abdde5;
              background-color: #FFF;
              
          }
          .contenidoSlider h4{
              width: 80%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #6EA205;
              font-size: 1em;
              text-align: center;
              font-weight: bold;
          }
          .contenidoSlider2 h4{
              width: 80%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #6EA205;
              font-size: 1.2em;
              text-align: center;
              font-weight: bold;
          }
          .contenidoSlider h5{
              width: 96%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #000;
              font-size: 0.7em;
              text-align: start;
              font-weight: bold;
          }
          .contenidoSlider2 h5{
              width: 96%;
              margin: auto;
              margin-bottom: 5px;
              margin-top: 5px;
              color: #000;
              font-size: 0.7em;
              text-align: start;
              font-weight: bold;
          }
          .contenidoSlider img{
              width: 96%;
              margin-left: 2%;
              margin-right: 2%;
              margin-bottom: 5px;
              margin-top: 5px;
              text-align: center;              
          }
          .contenidoSlider2 img{
              width: 80%;
              margin-left: 10%;
              margin-right: 10%;
              margin-bottom: 5px;
              margin-top: 5px;
              text-align: center;              
          }
          .contenidoSlider p{
              width: 94%;
              margin-left: 3%;
              margin-right: 3%;
              margin-bottom: 5px;
              margin-top: 5px;
              font-size: 0.7em
              
          }
          .contenidoSlider2 p{
              width: 94%;
              margin-left: 3%;
              margin-right: 3%;
              margin-bottom: 5px;
              margin-top: 5px;
              font-size: 0.8em
              
          }
          /* informacion eventos */
          .cajonInformacionEventos{
              width: 90%;
              margin: auto;
              display: flex;
              flex-direction: column;
              justify-content: space-around;
              margin-top: 30px;
              margin-bottom: 20px;
          }
          .sliderEventosInfo{
              width: 80%;
              margin: auto;
          }
          .cajonSlide{
              width: 100%;
          }
          .carousel-control-prev{
              height: 50px;
              margin-top: 35%;
          }
          .carousel-control-next{
              height: 50px;
              margin-top: 35%;
          }
          .carousel-control-prev-icon{
              background-color: #555;
              width: 40px;
              height: 40px;
          }
          .carousel-control-prev-icon:hover{
              background-color: #6EA205;
              width: 40px;
              height: 40px;
          }
          .carousel-control-next-icon{
              background-color: #555;
              width: 40px;
              height: 40px;
          }
          .carousel-control-next-icon:hover{
              background-color: #6EA205;
              width: 40px;
              height: 40px;
          }
          .informacionEventos{
              width: 80%;
              margin: auto;
              display: flex;
              flex-direction: column;
              
              padding-left:  3%;
          }
          .informacionEventos h3{
              color: #6EA205;
              font-weight: bold;
          }
          .informacionEventos p{
              color: #000;
          }
          .informacionEventos ul{
                          
          }
          /* Fin Informacion eventos */
          /* eventos */
          .espacioEventos{
              width: 100%;
          }
          .cajaEvento{
              width: 100%;
              display: flex;
              flex-direction: column;
          }
          .tituloSliderEvento{
              width: 100%;
              text-align: center;
          }
          .tituloSliderEvento h3{
              font-size: 1.5em;
              font-weight: bold;
              color: #6EA205;
          }
          .sliderEvento{
              width: 100%;
              
          }
          .contenedorNoticiasSlider{
              width: 100%;              
              display: flex;
              flex-direction: row;
              justify-content: space-around;
          }
          .noticia{
              width: 45%;
              text-align: center;
          }
          .botonNoticia{
              width: 100%;
              text-decoration: none;
          }
          .tituloNoticia{
              width: 100%;
              text-align: center;
          }
          .tituloNoticia h4{
              font-size: 1em;
              font-weight: bold;
              color: #6EA205;
          }
          .imagenNoticia{
              width: 100%;
              
          }
          .imagenNoticia img{
              width: 90%;
              margin: auto;
              height: auto;
          }
          /* Fin eventos */
    
    }
    @media (min-width:1069px){
        #evento3{
            display: block;            
        }
        #evento2{
            display: none;
        }
        #evento1{
            display: none;
        }
        
       .titutlopagina h3{
            float: right;
            font-size: 1.7em;
            font-weight: bold;
            text-shadow:
                -1px -1px 0 #000,
                1px -1px 0 #000,
                -1px 1px 0 #000,
                1px 1px 0 #000;       
        }
        .lineaTitulo{
            width: 100%;
            float: right;
            height: 2px;
            background-color: #FFF;
            -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.61);
            -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
            -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
            animation-name: example;
            animation-duration: 2s;
        }
        /* Safari 4.0 - 8.0 */
        @-webkit-keyframes example {
          0%   {width: 100%;margin-left: 0%;}
          50%  {width: 5%;margin-left: 95%;}
          100% {width: 100%;margin-left: 0%;}
          }

        /* Standard syntax */
        @keyframes example {
          0%   {width: 100%;margin-left: 0%;}
          50%  {width: 5%;margin-left: 95%;}
          100% {width: 100%;margin-left: 0%;}
          }
          .contenidoPrincipalEventos{
              width: 80%;
              margin: auto;
              margin-top: 10px;
          }
          /* informacion eventos */
          .cajonInformacionEventos{
              width: 80%;
              margin: auto;
              display: flex;
              flex-direction: row;
              justify-content: space-around;
              margin-top: 30px;
              margin-bottom: 20px;
          }
          .sliderEventosInfo{
              width: 48%;
              
          }
          .cajonSlide{
              width: 100%;
          }
          .carousel-control-prev-icon{
              background-color: #555;
              width: 40px;
              height: 40px;
          }
          .carousel-control-prev-icon:hover{
              background-color: #6EA205;
              width: 40px;
              height: 40px;
          }
          .carousel-control-next-icon{
              background-color: #555;
              width: 40px;
              height: 40px;
          }
          .carousel-control-next-icon:hover{
              background-color: #6EA205;
              width: 40px;
              height: 40px;
          }
          .informacionEventos{
              width: 48%;
              display: flex;
              flex-direction: column;
              padding-left:  3%;
          }
          .informacionEventos h3{
              color: #6EA205;
              font-weight: bold;
          }
          .informacionEventos p{
              color: #000;
          }
          .informacionEventos ul{
                          
          }
          /* Fin Informacion eventos */
          .menuPaginaEventos{
              width: 100%;
              display: flex;
              justify-content: space-around;
          }
          .botonSubmenu{
              background-color: #6EA205;
              color: #FFF;
          }
          /* eventos */
          .espacioEventos{
              width: 100%;
          }
          .cajaEvento{
              width: 100%;
              display: flex;
              flex-direction: column;
          }
          .tituloSliderEvento{
              width: 100%;
              text-align: center;
          }
          .tituloSliderEvento h3{
              font-size: 1.5em;
              font-weight: bold;
              color: #6EA205;
          }
          .sliderEvento{
              width: 100%;
              
          }
          .contenedorNoticiasSlider{
              width: 100%;              
              display: flex;
              flex-direction: row;
              justify-content: space-around;
          }
          .noticia{
              width: 30%;
              text-align: center;
          }
          .botonNoticia{
              width: 100%;
              text-decoration: none;
          }
          .tituloNoticia{
              width: 100%;
              text-align: center;
          }
          .tituloNoticia h4{
              font-size: 1em;
              font-weight: bold;
              color: #6EA205;
          }
          .imagenNoticia{
              width: 100%;
              
          }
          .imagenNoticia img{
              width: 90%;
              margin: auto;
              height: auto;
          }
          /* Fin eventos /*
          /* Galeria */
          
          
          /* Fin Galeria */
    }
    .galeria {
        text-align: center;
    }

    .galeria > div {
        display: inline-block;
        position: relative;
        width: 250px;
        height: 250px;
        background-color: #fff;
        margin: 20px 15px;
        padding: 10px 10px 50px;
        box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    }

    .galeria > div input[type="checkbox"] {
        display: none;
    }

    .galeria > div label {
        cursor: pointer;
    }

    .galeria > div label span {
        display: table-cell;
        width: 220px;
        height: 150px;
        vertical-align: middle;
        background-color: #FFF;
        box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.2) inset;
        padding: 0 10px;
        font-family: 'Trebuchet MS', Verdana, Arial, Calibri, sans-serif;
        font-weight: bold;
        text-align: center;
    }

    .galeria > div label img {
        display: block;
        width: 230px;
        position: absolute;
        top: 10px;
        left: 10px;
        transition: transform 0.2s linear;
    }

    .galeria > div label:before {
        content: '';
        display: block;
        transition: background-color 0.2s linear;
    }

    .galeria > div div {
        position: absolute;
        bottom: 5px;
        left: 7px;
    }

    .galeria > div div a {
        text-decoration: none;
        color: #ccc;
        font-size: 1.1em;
        margin-right: 5px;
        padding: 0 2px;
        transition: all 0.2s linear;
    }

    .galeria > div div a:nth-child(1):hover {
        color: #4867aa;
    }

    .galeria > div div a:nth-child(2):hover {
        color: #55acee;
    }

    .galeria > div div a:nth-child(3):hover {
        color: #dd4e42;
    }

    .galeria > div label:hover img {
        transform: scale(0.4) skew(-45deg, -45deg);
    }

    .galeria > div input[type="checkbox"]:checked + label img {
        position: fixed;
        width: 500px;
        top: calc(50% - 250px);
        left: calc(50% - 250px);
        z-index: 2;
        transform: none;
    }

    .galeria > div input[type="checkbox"]:checked + label:before {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
        background-color: rgba(0, 0, 0, 0.7);
        cursor: default;
    }